<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>目的地</title>
    <link rel="stylesheet" href="./css/common/reset.css" />
    <link rel="stylesheet" href="./css/common/1px.css" />
    <link rel="stylesheet" href="./css/diao/calendar.min.css" />
    <link rel="stylesheet" href="./components/zhao/index.css" />
    <link rel="stylesheet" href="./components/bottom/index.css" />
    <link rel="stylesheet" href="./css/zhao/search.min.css" />
  </head>
  <body>
    <script src="./lib/rem.js"></script>
    <header>
      <div class="header">
        <a href="javascript:history.go(-1)" class="header-icon"></a>

        <span class="header-text">选择目的地</span>
      </div>
      <nav class="nav-search">
        <div class="nav-search-target"></div>
        <div class="nav-search-wrap">
          <i class="nav-search-icon"></i>
          <span class="nav-search-text">春季旅游节</span>
        </div>
        <div class="nav-search-target"></div>
      </nav>
    </header>

    <section class="content">
      <!-- 左边栏导航 -->
      <div class="left-nav">
        <div class="left-nav-item unfold">
          <i class="left-icon hot-icon"></i>
          <p class="left-text">热门</p>
        </div>
        <div class="left-nav-item">
          <i class="left-icon inland-icon"></i>
          <p class="left-text">国内</p>
        </div>
        <div class="left-nav-item">
          <i class="left-icon foreign-icon"></i>
          <p class="left-text">国外</p>
        </div>
      </div>
      <!-- 右边栏展示 -->
      <div class="right-nav unfold">
        <div class="hot-nav unfold">
          <ul>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src="./images/zhao/images/search0407_01.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_02.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_03.jpg"
                  alt=""
                />
              </a>
              <p>厦门</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_04.jpg"
                  alt=""
                />
              </a>
              <p>香港</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_05.jpg"
                  alt=""
                />
              </a>
              <p>法国</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_06.jpg"
                  alt=""
                />
              </a>
              <p>泰国</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_07.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_08.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>
          </ul>
        </div>
      </div>

      <div class="right-nav">
        <div class="hot-nav unfold">
          <ul>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src="./images/zhao/images/search0407_01.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_02.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_03.jpg"
                  alt=""
                />
              </a>
              <p>厦门</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_04.jpg"
                  alt=""
                />
              </a>
              <p>香港</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_05.jpg"
                  alt=""
                />
              </a>
              <p>法国</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_06.jpg"
                  alt=""
                />
              </a>
              <p>泰国</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_07.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_08.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>
          </ul>
        </div>
      </div>

      <div class="right-nav">
        <div class="hot-nav unfold">
          <ul>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_07.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_08.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src="./images/zhao/images/search0407_01.jpg"
                  alt=""
                />
              </a>
              <p>上海迪尼斯</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_02.jpg"
                  alt=""
                />
              </a>
              <p>云南</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_03.jpg"
                  alt=""
                />
              </a>
              <p>厦门</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_04.jpg"
                  alt=""
                />
              </a>
              <p>香港</p>
            </li>

            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_05.jpg"
                  alt=""
                />
              </a>
              <p>法国</p>
            </li>
            <li>
              <a href="">
                <img
                  class="lazyload-img"
                  data-src=" ./images/zhao/images/search0407_06.jpg"
                  alt=""
                />
              </a>
              <p>泰国</p>
            </li>
          </ul>
        </div>
      </div>
    </section>
    <footer class="footer">
      <div class="footer-wrp-contain">
        <a href="index.html" class="footer-wrap-item">
          <img src="./images/common/footer_0322_05.png" alt="" />
          <span>首页</span>
        </a>
        <a href="search.html" class="footer-wrap-item">
          <img src="./images/common/footer_0322_02.png" alt="" />
          <!-- <span class="active">目的地</span> -->
          <span class="active">目的地</span>
        </a>
        <a href="history.html" class="footer-wrap-item">
          <img src="./images/common/footer_0322_07.png" alt="" />
          <span>浏览历史</span>
        </a>
        <a href="myinfo.html" class="footer-wrap-item">
          <img src="./images/common/footer_0322_08.png" alt="" />
          <span>个人</span>
        </a>
      </div>
    </footer>
    <script src="./lib/zepto.js"></script>
    <script src="./lib/components.js"></script>
    <script src="./js/zhao/search.js"></script>
  </body>
</html>
